<extend name="Public/base" />
<block name="content">
<div id="content">
    <div id="content-header">
        <div id="breadcrumb">
            <a href="{:U('Index/index')}" title="首页" class="tip-bottom"><i
                class="icon-home"></i> 首页</a> <a href="#" class="current">{$meta_title}</a>
        </div>
    </div>
    <div class="container-fluid">
        
       <div class="row-fluid">
            <a class="btn btn-success" href="{:U('ServiceSeat/recommendList')}" >
                <i class="icon-eye-open"></i>  
                查看我的推荐列表
            </a>
        </div>
		
        <div class="row-fluid">
        	
            <div class="span12">
                <h5>已经结束的活动<small> - 仅显示近三个月的活动</small></h5>
                <style type="text/css">
                .checkbox-warp{border:1px solid #ddd;padding:5px;margin-top:10px;}
                .checkbox-warp .activity-config{display:none;margin:5px 15px;}
                /*.box{margin:15px 0 0 0;padding:0 15px;}*/
                .active_item_hide{display:none;}
                .checkbox-activity{margin-left: 20px;}
                .checkbox-activity a{font-style: 12px;color: #888;}
                .checkbox-activity input{}
                .checkbox-village{padding: 5px 10px;border:1px solid #ccc;margin: 15px 5px;background: #FFF;font-size: 12px;}
                </style>
                <volist name="activity_list" id="vo" >
                    <div class="active_item checkbox-warp <neq name="i" value="1">active_item_hide</neq> ">
                        <label class="checkbox checkbox-activity">
                            <input type="checkbox" name="activity_list[{$i}][activity_id]" value="{$vo.activity_id}">
                            <a>{$vo.activity_name}</a>
                        </label>
                        <div class="activity-config">
                            <select name="activity_list[{$i}][ticket_level]">
                                <option value="-1">全部</option>
                                <option value="1">VIP</option>
                                <option value="0">普通票</option>
                            </select>

                            <select name="activity_list[{$i}][is_signin]">
                                <option value="-1">全部</option>
                                <option value="1">已签到</option>
                                <option value="0">未签到</option>
                            </select>

                            <select name="activity_list[{$i}][is_order]">
                                <option value="-1">全部</option>
                                <option value="1">已签单</option>
                                <option value="0">未签单</option>
                            </select>
                        </div>                
                    </div>
                </volist>
                <a id="j-btn-show-more" class="btn btn-link">点击获取更多活动</a>
            </div>
        </div>   
        <!-- 地区选择 -->
        <div class="row-fluid">
            <div class="span12">
                <h5>客户所在小区</h5>
                <div class="u-select-area pull-left" id="j-select-area" >
                    <select data-default="1" name="province_id" style="width:150px;display:none;"  id="j-select-province">
                        <option value="0">请选择省</option>
                    </select>
                    <select  data-default="1" name="city_id" style="width:150px;display:none;" disabled  id="j-select-city">
                        <option value="0">请选择城市</option>
                    </select>
                    <select data-default="0" name="ward_id" style="width:150px;display:none;"  id="j-select-ward">
                        <option value="0">请选择区</option>
                    </select>
                    <select data-default="0" name="village_id" style="width:150px;display:none;" disabled  id="j-select-village">
                        <option value="0">请选择居民区</option>
                    </select>

                    <a id="j-btn-add-site" class="btn btn-small btn-success" style="margin-top:1px;">添加</a>
                    <script src="__JS__/jjhh.js"></script>
                    <script type="text/javascript">
                    $(function(){
                         var url_area = {
                                "province" :"{:U('ServiceApi/getProvinceList')}",
                                "city" :"{:U('ServiceApi/getProvinceCityList')}",
                                "ward": "{:U('ServiceApi/getCityWard')}",
                                "village": "{:U('ServiceApi/getWardVillage')}"
                        }
                        jjhh_select_area(url_area, 4); 
                    })
                  </script>
                </div>
           
                <!-- 区&小区列表 -->
                <div class="row-fluid">
                    <div id="j-village-list" class="span12" style="margin-top:15px;margin-left:0;border:1px dashed #CCC;padding:15px;">
                        <p class="muted" style="">居民区信息显示区域, 请先选择区</p>
                    </div>
                </div>
                
                <!-- 区&小区列表 -->
            </div>
        </div>   
        <!-- /地区选择 -->
        <form method="post" id="j-form">     
            <!-- 装修信息1 -->
            <div class="row-fluid">
                <!-- 装修平米 -->
                <div class="span3">
                    <h5>装修平米</h5>
                    <div class="control-group">
                        <div class="controls">
                            <input name="min_decoration_meter" type="text" class="span5" placeholder="最少装修平米" onkeyup="value=value.replace(/\D*$/,'')" onblur="value=value.replace(/\D*$/,'')" maxlength="4">
                                    至
                            <input name="max_decoration_meter" type="text" class="span5" placeholder="最多装修平米" onkeyup="value=value.replace(/\D*$/,'')" onblur="value=value.replace(/\D*$/,'')" maxlength="4">
                        </div>
                    </div>
                </div>    
                <!-- /装修平米 -->
                
                <!-- 装修预算 -->
                <div class="span3">
                    <h5>装修预算</h5>
                    <div class="control-group">
                        
                        <div class="controls">
                            <input name="min_decoration_budget" type="text" class="span5" placeholder="最少装修预算" onkeyup="value=value.replace(/\D*$/,'')" onblur="value=value.replace(/\D*$/,'')" maxlength="7">
                                  元  至
                            <input name="max_decoration_budget" type="text" class="span5" placeholder="最多装修预算" onkeyup="value=value.replace(/\D*$/,'')" onblur="value=value.replace(/\D*$/,'')" maxlength="7">
                            元
                        </div>
                    </div>
                </div>    
                <!-- /装修预算 -->     

                <!-- 入户时间 -->
                <div class="span3">
                    <h5>入户时间</h5>
                    <div class="control-group">
                        <div class="controls">
                            <input  name="min_home_time" class="min-date datepicker span5" type="text" placeholder="请选择入户开始时间" onkeyup="value=value.replace(/\D*$/,'')" onblur="value=value.replace(/\D*$/,'')" readonly="readonly">
                                至
                            <input  name="max_home_time" class="max-date datepicker span5" type="text" placeholder="请选择入户结束时间" onkeyup="value=value.replace(/\D*$/,'')" onblur="value=value.replace(/\D*$/,'')" readonly="readonly">
                        </div>
                    </div>
                </div>    
                <!-- /入户时间 -->

                <!-- 装修日期 -->
                <div class="span3">
                    <h5>装修日期</h5>
                    <div class="control-group">
                        <div class="controls">
                            <input  name="min_decoration_time" class="min-date datepicker span5" type="text" placeholder="请选择装修开始时间" onkeyup="value=value.replace(/\D*$/,'')" onblur="value=value.replace(/\D*$/,'')" readonly="readonly">
                                至
                            <input  name="max_decoration_time" class="max-date datepicker span5" type="text" placeholder="请选择装修结束时间" onkeyup="value=value.replace(/\D*$/,'')" onblur="value=value.replace(/\D*$/,'')" readonly="readonly">                  
                        </div>
                    </div>
                </div>    
                <!-- /装修日期 -->                    
            </div>
            <!-- /装修信息1 -->
            <!-- 装修信息2 -->
            <div class="row-fluid">
                <div class="control span12" id="demand_list">
                    <p style="padding:15px; border:1px dashed #ccc;" class="muted">装修筛选信息加载中...</p>
                </div>
            </div>
            <!-- /装修信息2 -->
            <a id="j-btn-ok" class="btn btn-primary"><i class="icon-ok"></i> 确定</a> 
        </form>
    </div>
</div>
<script src="__STATIC__/aui-artDialog-9fd667e/dist/dialog.js"></script>
<link rel="stylesheet" href="__STATIC__/aui-artDialog-9fd667e/css/ui-dialog.css">
<script type="text/javascript">
var IS_INIT = 1;
$(function (){
    $.ajax({ url: "{:U('ServiceStatistics/getDemandList')}", success: function(data){
        $('#demand_list').html(data).hide().fadeIn(500);
        $(".checkbox-all").bind("click",function(){
            $(this).nextAll("div.checkbox-group").children("label").children("input").prop("checked", true);
        });
        // 反选
        $(".checkbox-opposite").bind("click",function(){
            $(this).nextAll("div.checkbox-group").children("label").children("input[type=checkbox]").each(function(e) {
                if ($(this).is(":checked")) {
                    $(this).prop("checked", false);
                }else{
                    $(this).prop("checked", true);
                }
            });
        });
    }});
    
    // 过滤
    var URL_FILTER = "../json/data.filter.json";
    $("#j-btn-ok").click(function() {
    	var that$ = $(this);
    	if(that$.attr('disabled') != 'disabled'){
            that$.attr('disabled',true);
    		var form_data = $("#j-form").serializeArray();
            var query = [];
            for (k in form_data) {
                var item = form_data[k]
                if ("" != item.value) {
                    query.push(item.name + "=" + item.value);
                }
            }
            // 已报名活动
            $("label.checkbox-activity").children("input:checked").each(function() {
                var key = $(this).attr("name");
                var value = $(this).val();
                query.push(key + "=" + value);

                $(this).parent().next("div.activity-config").find("select").each(function() {
                    var key = $(this).attr("name");
                    var value = $(this).val();
                    query.push(key + "=" + value);
                });
            });

            $("#j-village-list").find("input:checked").each(function() {
                var key = $(this).attr("name");
                var value = $(this).val();
                query.push(key + "=" + value);
            });
            var query_string = query.join("&");

            // XHR
            $.ajax({
                "url": "{:U('ServiceSeat/recommend')}",
                "type": "POST",
                "dataType": "JSON",
                "data": query_string
            }).done(function(json) {
            	that$.attr('disabled',false);
                console.log(json);
                if (1 == json.status) {
                    // 有筛选结果
                    if (0 < json.data.num) {
                        dialog({
                            "title": "将筛选后客户放入列表",
                            "content": "<p>已有用户<a style=\"color:#f40;\">" + json.data.num + "</a>人</p><div><input maxlength=\"20\" id=\"j-ipt-list-name\"/></div>",
                            "okValue": "确定",
                            "ok": function() {
                                $.ajax({
                                    "url": "{:U('ServiceSeat/addNewRecommend')}",
                                    "type": "POST",
                                    "dataType": "JSON",
                                    "data": {"list": json.data.list, "recommend_name": $("#j-ipt-list-name").val()}
                                }).done(function(json) {
                                    if (1 == json.status) {
                                        var d = dialog({
                                            "title": "提示",
                                            "content": json.info
                                        }).showModal();
                                        window.location.href = "{:U('ServiceSeat/myRecommend')}";
                                        setTimeout(function() {
                                            d.close().remove();
                                        }, 2000);
                                    } else {
                                        dialog({
                                            "title": "提示",
                                            "content": json.info
                                        }).showModal();
                                    }
                                });
                            }
                        }).showModal();
                    } else {
                        dialog({
                            "title": "提示",
                            "content": "没有搜索到结果"
                        }).showModal();
                    }
                } else {
                    dialog({
                        "title": "提示",
                        "content": json.info
                    }).showModal();
                }
            });
    	}
    });
    //新增跳转页面
    $('#add').click(function(){
        window.location.href="{:U('Base/addSms')}";
    });
  //初始化日期选择器
    $(".datepicker").datetimepicker({
        format: 'yyyy-mm-dd', 
        autoclose: true,
        todayBtn: true,
        minView:4
    }).on('changeDate', function(){
        // 最小日期
        if($(this).hasClass('min-date')) {
            var min = Date.parse($(this).val());
            var max = Date.parse($(this).next("input.max-date").val());
            if (max <= min && max > 0) {
                var d = dialog({
                    "title": "提示",
                    "content": "开始时间不能大于等于结束时间!"
                }).showModal();
                setTimeout(function(){
                    d.remove().close();
                }, 2000);
            }          
        } else {
            var max = Date.parse($(this).val());
            var min = Date.parse($(this).prev("input.min-date").val());
            if (max <= min && min > 0) {
                var d = dialog({
                    "title": "提示",
                    "content": "开始时间不能大于等于结束时间!"
                }).showModal();
                setTimeout(function(){
                    d.remove().close();
                }, 2000);
            }   
        }
    });

    // 全选/反选
    $(".btn-checkbox-all").click(function() {
        $(this).nextAll("div.checkbox-group").children("label").find("input").click("checked", true);
    });

    // 反选
    $(".btn-checkbox-opposite").click(function() {
        $(this).nextAll("div.checkbox-group").children("label").find("input[type=checkbox]").each(function() {
            if ($(this).is(":checked")) {
                $(this).prop("checked", false);
            }else{
                $(this).prop("checked", true);
            }
        });
    });

    // 显示更多活动
    $("#j-btn-show-more").click(function() {
        $(".active_item_hide:lt(5)").slideDown();
    });

    // $("select.select2").select2();
    $("label.checkbox-activity").click(function() {
        $this = $(this);
        if (!$this.children("input").is(":checked")){
            $this.next("div.activity-config").stop(true).slideUp(300);
            $this.siblings('div').find('select').val('');
        } else {
            $this.next("div.activity-config").stop(true).slideDown(300)
        }
    });


    // 添加小区信息到数据区
    var id_pool = [];
    $("#j-btn-add-site").click(function() {
        var $village = $("#j-select-village");
        var village_id = $village.val();
        var is_unique = true;
        
        for (k in id_pool){
            if (village_id == id_pool[k]) {
                is_unique = false;
                break;
            }
        }   
                   
        if (is_unique && village_id > 0 ){
            id_pool.push(village_id);
            function tpl(name, value) {
                var html = "";
                html+= "    <label class=\"checkbox-village checkbox \">";
                html+= "        <a>" + name + "</a>";
                html+= "        <input style=\"margin:5px\"; checked name=\"village[]\" type=\"checkbox\" value=\"" + value + "\">";
                html+= "    </label>";
                return html;
            }
            var html = tpl($village.children("option[selected=selected]").html(), village_id);
            $("#j-village-list").append(html);            
        }
    });
});
//导航高亮
highlight_subnav("{:U('ServiceSeat/recommend')}");
</script>

<!-- 自由发挥区结束 -->
</block>